<template>

    <!-- 添加或修改盘点计划对话框 -->
    <el-dialog :title="title" v-model="open" width="600px" append-to-body>
      <el-timeline>
        <el-timeline-item
          v-for="(activity, index) in activities"
          :key="index"
          :icon="activity.icon"
          :type="activity.type"
          :color="activity.color"
          :size="activity.size"
          :timestamp="activity.timestamp">
          {{activity.content}}
        </el-timeline-item>
      </el-timeline>
    </el-dialog>
</template>

<script>
    import brand from '@/api/goods/brand';
    import modelMixin from '@/mixins/modelMixin'
    export default {
        name: "orderTracking",
        mixins: [modelMixin],
        data() {
            return {
              activities: [
                {
                  icon: 'el-icon-check',
                  type: 'success',
                  color: '#67C23A',
                  size: 'large',
                  timestamp: '2022-01-01 10:00:00',
                  content: 'Order placed'
                },
                {
                  icon: 'el-icon-truck',
                  type: 'primary',
                  color: '#409EFF',
                  size: 'large',
                  timestamp: '2022-01-02 14:30:00',
                  content: 'Order shipped'
                },
                {
                  icon: 'el-icon-box',
                  type: 'warning',
                  color: '#E6A23C',
                  size: 'large',
                  timestamp: '2022-01-03 09:15:00',
                  content: 'Order delivered'
                }
              ],
              title: 'Order Tracking',
              open: false
            }
        },
        created(){
        },
          methods: {
            // Method to open the order tracking dialog
            show() {
              this.open = true;
            },
            // Method to close the order tracking dialog
            close() {
              this.open = false;
            }
          }
    }
</script>

<style lang="scss" scoped>

</style>